<template>
	<view class="pages">
		<view>
			<view class="type">
	<!-- 			<text>种类:</text>
				<uni-data-select class="select"
				    v-model="actype"
				    :localdata="range"
				    @change="change"
					
				  ></uni-data-select> -->
				  <view  v-for="(item,key) in range" :key="key" :class="actype==item.value?'item active':'item'"  @click="change(item.value)">
					  {{item.text}}
				  </view>
			</view>
			<view class="content">
				<view class="list">
					<view class="title" v-for="(item,index) in list" :key="index">
						<text>创建时间：{{item.creatime}}</text>
						<text>{{item.prodetail}}</text>
						<text>备注：{{item.proName}}</text>
					</view>
					
				</view>
			</view>
		</view>
      
	<!-- 	<uni-popup ref="popupSuccess" type="message">
			<uni-popup-message :type="type" :message="title" :duration="2000"></uni-popup-message>
		</uni-popup> -->
	</view>
</template>

<script>
		import {showShopCarInfobyworktype} from "../../common/api.js"
	export default {
		data() {
			return {
				list:[],
				actype:'chouzg',
				currUser:'',
				range:[{ value: 'chouzg', text: "新品体验"},
				{ value: 'peixun', text: "培训"},
				{ value: 'jiaocheng', text: "教程"},
				{ value: 'gangwei', text: "岗位"},
				]
			}
		},
		created(){
			this.currUser = uni.getStorageSync('currUser')
	     	this.init()
		},
		methods: {
			init(){
				showShopCarInfobyworktype({userid:this.currUser.userid,Status:1,actype:this.actype}).then(res=>{
					this.list=res.extend.list
				})
			},
           change(e){
			   this.actype=e
			   this.init()
		   }
		}
	}
</script>

<style lang="scss" scoped>
	.pages{
		
	}
	.type{
		background:#fff;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding:30rpx;
		// .select{
		// 	margin-left:20rpx;
		// 	width:150px;
		// }
		.item{
			border:1px solid #ddd;
			padding:10rpx 15px;
			border-radius:10px;
			
			font-size:14px;
		}
		.item.active{
			background:#ea6011;
			color:#fff;
		}
	}
	.content{
		padding:30rpx;
		.title{
			margin-bottom:30rpx;
			background:#fff;
			padding:30rpx;
			
			display:flex;
			flex-direction: column;
			justify-content: flex-start;
			font-size:12px;
			text:nth-child(1){
				
			}
		}
	}
</style>
